<style lang="scss" scoped>
	@import '@/assets/css/variable';
	.selectCampus{
		width: 100%;
		background-color: $main-bgc-gray;
		min-height: 100%;
		font-size: 1.2rem;
		overflow-y: scroll;
		box-sizing: border-box;
		position: relative;
		flex:1;
		overflow: hidden;
		.line{
			padding: $padding-llg;
			.selectText{
				color: $color3;
				font-size: 1.4rem;
			}
		}
		.list{
			padding: 0 $padding-llg;
			.item{
				display: flex;
				align-items: center;
				justify-content: space-between;
				background: white;
				padding: 0.8rem 1.2rem;
				border-radius: 0.6rem;
				margin-bottom: 1.2rem;
				.name{
					color:#444;
					font-size: 1.3rem;
				}
				.icon{
					img{
						width: 2rem;
						height: 2rem;
					}
				}
			}
		}
		.fix-bottom{
		  position: fixed;
		  bottom: 0rem;
		  left: 0;
		  right: 0;
		  z-index: 1;
		  box-sizing: border-box;
		  background: white;
		  text-align: center;
		  .submitBtn{
			  background-color:$mainColor;
			  color:white;
			  width: 60%;
			  margin: 0.2rem auto;
			  font-size: 1.4rem;
		  }
		}
	}
</style>
<template>
	<div class="selectCampus">
		<div class="line">
			<div class="selectText" v-if="selectedCampus">
				已选择校区: <span class="t-bold">{{selectedCampus.name}}</span>
			</div>
			<div class="selectText" v-else>
				请选择您所在的校区:
			</div>
		</div>
		<div class="list" v-if="campusList&&campusList.length>0">
			<div class="item" v-for="(item,index) in campusList" :key="index" @click="selectCampusEvent(index)">
				<span class="name">{{item.name}}</span>
				<span class="icon">
					<img src="../../assets/img/circle_select.svg" v-if="active===index">
					<img src="../../assets/img/circle.svg" v-else>
				</span>
			</div>
		</div>
		<div class="fix-bottom">
			<van-button round class="submitBtn" @click="submit" :loading="loading">完成选择</van-button>
		</div>
	</div>
</template>

<script>
// @ is an alias to /src


export default {
  name: 'selectCompus',
  components: {
    
  },
  data() {
	  return {
		  selectedCampus:'',
		  campusList:'',
		  active:'',
		  from:'',
		  loading:false
	  }
  },
  created() {
  	// this.campusList = this.$store.state.campusList
	// console.log("campusList",this.campusList)
	// this.selectedCampus = this.$store.state.selectedCampus
	// const userInfo = JSON.parse(localStorage.getItem('userInfo'))
	// if(!userInfo){
	// 	this.$router.push('/my')
	// }
  },
  mounted() {
	// this.getweixinconfig()
	this.from = this.$route.query.from
	console.log("selectCampus_from",this.from)
	this.CampusH5Items()
 //  	this.selectedCampus = JSON.parse(localStorage.getItem('selectedCampus')) || 1
	// const campusList = this.$store.state.campusList
	// if(campusList.length>0){
	// 	this.campusList = campusList
	// 	this.campusList.forEach((item,index)=>{
	// 		if(item.id==this.selectedCampus.id){
	// 			this.active = index 
	// 			console.log('this.active',this.active)
	// 		}
	// 	})
	// }else{
	// 	this.CampusH5Items()
	// }
  },
  methods:{
	  
	  CampusH5Items() {
		  let params = {
		  	
		  }
		  this.$request.CampusH5Items(params).then(res=>{
		  	// Dialog({ message: '提示' });
		  	console.log("CampusH5Items",res)
		  	if(res.ret==200){
		  		this.campusList = res.data
				this.$store.commit('setCampusList',this.campusList)
				this.campusList.forEach((item,index)=>{
					if(item.id==this.selectedCampus.id){
						this.active = index 
						console.log('this.active',this.active)
					}
				})
		  	}
		  })
	  },
	  selectCampusEvent(index) {
		  this.active = index
		  this.selectedCampus = this.campusList[index]
		  this.$store.commit('setSelectedCampus',this.selectedCampus)
		  localStorage.setItem('selectedCampus',JSON.stringify(this.selectedCampus))
	  },
	  submit() {
		 this.setFansItem()
	  },
	  setFansItem() {
	    const _this = this;
		const item = JSON.parse(localStorage.getItem('userInfo'))
		console.log("insertUserInfo",item)
		if(item.openid){
			let params = {
				openid: item.openid,
				nickname: item.nickname,
				avatar: item.headimgurl||item.avatar,
				province: item.province,
				city: item.city,
				campus_id:this.selectedCampus.id
			}
			this.loading = true;
			console.log("=============MemberH5Item_OUT================")
			_this.$request.MemberH5Item(params).then(res=>{
				console.log("=============MemberH5Item_IN================")
				//默认
				//   let url = _this.from=='my'?'/my':'/home'
				//   this.$router.replace(url)
				if(res.ret=200){
					let url = ''
					if(_this.from=='my'){
						url = '/my'
					}else if(_this.from=='home'){
						url = '/home'
					}else{
						url = localStorage.getItem('from')
					}
					console.log("=============url================",url)
					_this.$router.push(url)
				}else{
					localStorage.clear()
					// this.$router.push('/home')
					// window.location.href = '//pysqjy.xiaoqibao.net/index.html#/home'
					self.location = '//pysqjy.xiaoqibao.net/index.html#/my'
				}
			}).finally(res=>{
				this.loading = false;
			})
		}else{
			//alert("openid未获取到")
			localStorage.setItem('openid','')
			self.location = '//pysqjy.xiaoqibao.net/index.html#/my'
		}
	    
	  },
  }
}
</script>
